/* eslint-disable no-sparse-arrays */
/* eslint-disable no-redeclare */
import React, { PureComponent, Fragment } from 'react'
import PropTypes from 'prop-types'
import { connect } from 'umi'
import { Button, Row, Input, Form, message, Spin, Radio, Modal } from 'antd'
import { GlobalFooter } from 'components'
import { GithubOutlined } from '@ant-design/icons'
import { Trans, withI18n } from '@lingui/react'
import { setLocale, formItemLayout, tailLayout } from 'utils'
import config from 'utils/config'
import store from 'store'
import styles from './index.less'
import { post, get } from '@/services/https'
import {
  UserOutlined,
  LockOutlined,
  GlobalOutlined,
  SecurityScanOutlined,
  SaveOutlined,
} from '@ant-design/icons'
import { publicIp } from '../../services/apiIp'
import base64 from '@/utils/base64'
let base = new base64()
const FormItem = Form.Item

@withI18n()
@connect(({ loading, dispatch }) => ({ loading, dispatch }))
class Login extends PureComponent {
  formRefBlack = React.createRef()
  state = {
    name: '',
  }
  componentDidMount() {}
  regEmail = (email) => {
    if (String(email).indexOf('@') > 0) {
      let str = email.split('@'),
        _s = ''
      if (str[0].length > 3) {
        for (let i = 0; i < str[0].length - 3; i++) {
          _s += '*'
        }
      }
      var new_email = str[0].substr(0, 3) + _s + '@' + str[1]
    }
    return new_email
  }
  handleCancelBlack = () => {
    this.formRefBlack.current.resetFields()
    this.setState({ is_two_Show: false })
  }
  handleSaveBtnBlack = (values) => {}
  render() {
    const { dispatch, loading } = this.props
    const {
      base64_str,
      auth_mail,
      is_two_Show,
      initialValuesBlack,
    } = this.state
    const handleOk = (values) => {
      post('/authorize/student/login', values).then((res) => {
        if (res.code === 0) {
          sessionStorage.setItem('loginName', values.username)
          document.cookie = 'loginName=' + values.username
          let obj = { code: 200, data: { user_type: 1 }, msg: 'SUCCESS' }
          sessionStorage.setItem('Theuser', JSON.stringify(obj))
          if (values.username === 'admin') {
            var data = [
              '1',
              '1-1',
              '1-2',
              '1-3',
              '2',
              '2-1',
              '2-2',
              '2-2-1',
              '2-3',
              '2-3-1',
              '2-3-2',
              '2-3-1-1',
              '2-3-2-1',
              '7',
              '6',
              '6-1',
              '6-1-1',
              '2-1-1',
              '1-1-1',
              '1-2-1',
              '1-3-1',
              '3',
              '3-1',
              '3-2',
              '3-3',
              '3-1-1',
              '3-2-1',
              '3-3-1',
              '5',
              '5-1',
              '4',
              '4-1',
              '4-2',
              '4-3',
            ]
          } else {
            var data = [
              '1',
              '1-1',
              '1-2',
              '1-3',
              '2',
              '2-1',
              '2-2',
              '2-2-1',
              '2-3',
              '2-3-1',
              '2-3-2',
              '2-3-1-1',
              '2-3-2-1',
              '7',
              '6',
              '6-1',
              '2-1-1',
              '1-1-1',
              '1-2-1',
              '1-3-1',
              '3',
              '3-1',
              '3-2',
              '3-3',
              '3-1-1',
              '3-2-1',
              '3-3-1',
              '5',
              '5-1',
              '5-1-1',
              '4',
              '4-1',
              '4-2',
              '4-3',
            ]
          }
          let list = data
          let arr = list
          sessionStorage.setItem('Permission', JSON.stringify(arr))
          sessionStorage.setItem('Myhomework', 0)
          sessionStorage.setItem('token', res.token)
          var timestamp = new Date().valueOf() // 过期时间
          sessionStorage.setItem('timeout', res.timeout * 1000) // 过期时间
          sessionStorage.setItem('timestamp', timestamp) //当前登录时间
          message.success('登录成功')
          dispatch({ type: 'app/query' })
        } else {
          message.error(res.info)
        }
      })
    }
    const formPropsBlack = {
      name: 'basicBlack',
      onFinish: this.handleSaveBtnBlack,
      initialValuesBlack,
      ref: this.formRefBlack,
    }
    return (
      <Fragment>
        <div
          style={{
            display: 'flex',
            flexDirection: 'row',
            height: '100vh',
            background: '#fff',
          }}
        >
          <div style={{ width: '100%', position: 'relative' }}>
            <img
              alt=""
              className={styles.bgone}
              src={require('./img/subj.png')}
            />
            <img
              alt=""
              style={{
                position: 'absolute',
                width: '706PX',
                left: '50%',
                top: '88px',
                marginLeft: '-353px',
                zIndex: '1',
              }}
              src={require('./img/login.png')}
            />
            <img
              alt=""
              style={{
                position: 'absolute',
                width: '320px',
                left: '50%',
                top: '260px',
                marginLeft: '-160px',
                zIndex: 1,
              }}
              src={require('./img/bj1s.png')}
            />
            <img
              style={{
                position: 'absolute',
                width: '560px',
                left: '50%',
                top: '406px',
                marginLeft: '-280px',
              }}
              alt=""
              src={require('./img/form.png')}
            />
            <img
              style={{
                position: 'absolute',
                width: '144px',
                left: '20px',
                top: '20px',
              }}
              alt=""
              src={require('./img/TopL.png')}
            />
            <img
              style={{
                position: 'absolute',
                width: '144px',
                right: '20px',
                top: '20px',
              }}
              alt=""
              src={require('./img/TopR.png')}
            />
            <img
              style={{
                position: 'absolute',
                width: '144px',
                left: '20px',
                bottom: '20px',
              }}
              alt=""
              src={require('./img/BonL.png')}
            />
            <img
              style={{
                position: 'absolute',
                width: '144px',
                right: '20px',
                bottom: '20px',
              }}
              alt=""
              src={require('./img/BouR.png')}
            />
          </div>
          <div
            style={{
              width: '100%',
              display: 'flex',
              justifyContent: 'center',
              position: 'absolute',
              top: '439px',
            }}
          >
            <div className={styles.table}>
              <div className={styles.form}>
                <Form onFinish={handleOk} style={{ fontSize: '20px' }}>
                  <div
                    style={{
                      display: 'flex',
                      flexDirection: 'row',
                      alignItems: 'center',
                      marginBottom: '20px',
                    }}
                  >
                    <div
                      style={{
                        display: 'flex',
                        flexDirection: 'row',
                        alignItems: 'center',
                        width: '150px',
                      }}
                    >
                      <div>
                        <img
                          style={{
                            width: '20px',
                          }}
                          alt=""
                          src={require('./img/DL.png')}
                        />
                      </div>
                      <div style={{ marginLeft: '8px', marginTop: '2px' }}>
                        用户名
                      </div>
                    </div>
                    <FormItem
                      name="username"
                      rules={[{ required: true, message: '请输入用户名' }]}
                      hasFeedback
                      style={{ marginBottom: '0px', width: '100%' }}
                    >
                      <Input
                        placeholder="请输入用户名"
                        style={{
                          width: '100%',
                          borderRadius: '50px',
                          height: '42px',
                          fontSize: '18px',
                          paddingLeft: '20px',
                        }}
                      />
                    </FormItem>
                  </div>
                  <div
                    style={{
                      display: 'flex',
                      flexDirection: 'row',
                      alignItems: 'center',
                      marginBottom: '35px',
                    }}
                  >
                    <div
                      style={{
                        display: 'flex',
                        flexDirection: 'row',
                        alignItems: 'center',
                        width: '150px',
                      }}
                    >
                      <div>
                        <img
                          style={{
                            width: '20px',
                          }}
                          alt=""
                          src={require('./img/Mm.png')}
                        />
                      </div>
                      <div style={{ marginLeft: '8px', marginTop: '2px' }}>
                        密码
                      </div>
                    </div>
                    <FormItem
                      name="password"
                      rules={[{ required: true, message: '请输入密码' }]}
                      hasFeedback
                      style={{ marginBottom: '0px', width: '100%' }}
                    >
                      <Input
                        type="password"
                        placeholder="请输入密码"
                        style={{
                          width: '100%',
                          borderRadius: '50px',
                          height: '42px',
                          fontSize: '18px',
                          paddingLeft: '20px',
                        }}
                      />
                    </FormItem>
                  </div>
                  <Button
                    type="primary"
                    htmlType="submit"
                    loading={loading.effects.login}
                    style={{
                      width: '280px',
                      height: '42px',
                      background: '#14BBF7',
                      borderRadius: '30px',
                      border: 'none',
                    }}
                  >
                    <Trans>开始学习</Trans>
                  </Button>
                </Form>
              </div>
            </div>
            {/* <div style={{ position: 'absolute', bottom: '15px' }}>
                            科技公司
                        </div> */}
          </div>
        </div>
      </Fragment>
    )
  }
}

Login.propTypes = {
  form: PropTypes.object,
  dispatch: PropTypes.func,
  loading: PropTypes.object,
}

export default Login
